<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Forms</title>

<link href="__PUBLIC__/admin/css/bootstrap.min.css" rel="stylesheet">
<link href="__PUBLIC__/admin/css/datepicker3.css" rel="stylesheet">
<link href="__PUBLIC__/admin/css/styles.css" rel="stylesheet">
<style>
.form-group{position: relative;}
.form-group .glyphicon{position: absolute;right: 0px; top: 0px;}
.form-group label.error{display: none !important;}
</style>

<!--[if lt IE 9]>
<script src="__PUBLIC__/admin/js/html5shiv.js"></script>
<script src="__PUBLIC__/admin/js/respond.min.js"></script>
<![endif]-->

</head>

<body>
	
	<div class="row">
		<div class="col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-4 col-md-offset-4">
			<div class="login-panel panel panel-default">
				<div class="panel-heading">登录</div>
				<div class="panel-body">
					<form role="form" action="{:U('login/login')}" method="post" id="login_form">
						<fieldset>
							<div class="form-group">
								<input class="form-control" placeholder="登录名" name="email" type="text" autofocus="">
							</div>
							<div class="form-group">
								<input class="form-control" placeholder="密码" name="password" type="password" value="">
							</div>
							<div class="checkbox">
								<label>
									<input name="remember" type="checkbox" value="1">记住密码
								</label>
							</div>
							<input type="submit" class="btn btn-primary" value="登录">
						</fieldset>
					</form>
				</div>
			</div>
		</div><!-- /.col-->
	</div><!-- /.row -->	
	
		

	<script src="__PUBLIC__/admin/js/jquery-1.11.1.min.js"></script>
	<script src="__PUBLIC__/admin/js/bootstrap.min.js"></script>
	<script src="__PUBLIC__/admin/js/chart.min.js"></script>
	<script src="__PUBLIC__/admin/js/chart-data.js"></script>
	<script src="__PUBLIC__/admin/js/easypiechart.js"></script>
	<script src="__PUBLIC__/admin/js/easypiechart-data.js"></script>
	<script src="__PUBLIC__/admin/js/bootstrap-datepicker.js"></script>
	<script src="__PUBLIC__/admin/js/jquery.validate.min.js"></script>
	<script>
		!function ($) {
			$(document).on("click","ul.nav li.parent > a > span.icon", function(){		  
				$(this).find('em:first').toggleClass("glyphicon-minus");	  
			}); 
			$(".sidebar span.icon").find('em:first').addClass("glyphicon-plus");
		}(window.jQuery);

		$(window).on('resize', function () {
		  if ($(window).width() > 768) $('#sidebar-collapse').collapse('show')
		})
		$(window).on('resize', function () {
		  if ($(window).width() <= 767) $('#sidebar-collapse').collapse('hide')
		})
	</script>
	<!-- 登录验证 -->
	<script>
	$(function(){
		$("#login_form").validate({
		    rules: {
		      email: {
		      	required:true
		      },
		      password: {
		      	required:true
		      }
		    },
		    messages: {
		      email: {
		      	required:"请输入您的昵称"
		      },
		      password:{
		      	required:"请输入用户密码"	
		      }
		    },
		    // 当验证失败的时候会做的事情
			errorPlacement: function(error, element) { 
				// console.log(error);
				// console.log(element);
				element.parent().append('<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span>');
				element.parent().append(error);
				element.parents(".form-group").find(".glyphicon-ok").remove();
				element.parents(".form-group").addClass("has-error");
			},success: function(element) {
				// alert(element.html());
				element.parents(".form-group").removeClass("has-error");
				element.parents(".form-group").addClass("has-success");
				element.parents(".form-group").append('<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>');
				element.parents(".form-group").find(".glyphicon-remove").remove();
				element.remove();
			}
		});
	})
	</script>	
</body>

</html>
